<template>
    <div class="bg-content">
        <div style="margin-bottom: 10px; background-color: white;">
            <u-cell-group title="已选择">
                <u-cell-item v-for="(item, index) of selectedItems" :key="index" :arrow="false"
                             :title="item.code + ' - ' + item.name"></u-cell-item>
            </u-cell-group>
            <u-button type="error" @click="confirm()" :disabled="!selectedItems.length">确定选中</u-button>
        </div>
        <div style="background-color: white; padding-top: 1px;">
            <u-search placeholder="编号/名称/电话号码" shape="square" v-model="searchKeyword" @search="onSearch" @custom="onSearch"></u-search>
            <u-cell-group>
                <u-cell-item v-for="(item, index) of tbCommunityUserList" :key="item.id" :title="item.code + ' - ' + item.name" :arrow="true"
                             @click="select(item)"></u-cell-item>
            </u-cell-group>
        </div>
        <div style="padding-top: 10px; padding-bottom: 10px;">
            <u-loadmore :status="pagination.status" bg-color="#eeeeee"/>
        </div>
    </div>
</template>

<script>
    import {CommonUtil} from "../../../dev/core/utils/common.util";
    import {TbCommunityUserService} from "../../../dev/services/tb-community-user.service";

    export default {
        data: function () {
            return {
                searchKeyword: '',
                communityId: '',
                tbCommunityUserList: [],
                selectedItems: []
            }
        },
        onShow() {
            const _self = this;
            if (_self.urlParams.type === "0") {
                uni.setNavigationBarTitle({
                    title: '请选择业务员'
                });
            } else if (_self.urlParams.type === "1") {
                uni.setNavigationBarTitle({
                    title: '请选择客户'
                });
            }
            this.doRefresh(this.tbCommunityUserList);
        },
        methods: {
            onSearch(event) {
                const _self = this;
                this.searchKeyword = CommonUtil.trim(this.searchKeyword);
                this.doRefresh(this.tbCommunityUserList);
            },
            select(item) {
                const _self = this;
                let list = _self.selectedItems.filter(selectedItem => selectedItem.id === item.id);
                if (!list.length) {
                    _self.selectedItems.push(item);
                }
                CommonUtil.toast(`${item.code} - ${item.name} 选择成功`);
                _self.$forceUpdate();
            },
            confirm() {
                const _self = this;
                CommonUtil.alert({
                    title: '提示！',
                    content: '选择确认吗？',
                    showCancel: true, // 是否显示取消按钮
                    success: function (res) {
                        if (res.cancel) { // 点击取消,默认隐藏弹框
                        } else { // 点击确定
                            if (_self.objParams.callback) {
                                // 自定义回调函数，在回调函数中处理。
                                _self.objParams.callback(_self.selectedItems);
                            } else {
                                // 默认将值赋予哪些属性
                                let communityUserIds = [];
                                let communityUserNames = [];
                                _self.selectedItems.forEach(item => {
                                    communityUserIds.push(item.id);
                                    communityUserNames.push(item.name);
                                });
                                _self.objParams.communityUserIds = communityUserIds.join(",");
                                _self.objParams.communityUserNames = communityUserNames.join(",");
                            }
                            CommonUtil.toastNavigateBack();
                        }
                    }
                });
            },
            /**
             * 加载更多数据中
             * @param infiniteScroll
             */
            doInfinite(infiniteScroll) {
                const _self = this;
                new TbCommunityUserService().findTableListCascade({
                    pagination: _self.pagination,
                    data: {
                        communityId: _self.globalVariable.userInfo.tbCommunity.id,
                        searchKeyword: _self.searchKeyword,
                        type: '0',
                        status: '1',
                        deleted: 0
                    }
                }).then(result => {
                    _self.pagination.refreshPage(result);
                    _self.tbCommunityUserList = [..._self.tbCommunityUserList, ...result.list];
                });
            }
        },
    }
</script>
